<!--自建房排查-->
<template>
  <div id="SinceBuilding">
    <van-tabs v-model="active" @change="handle">
      <van-tab title="待检查">
        <div class="SinceBuilding-nfcc">
          <div style="margin-top: 10px">
            <van-search
              v-model="value"
              style="border-radius: 10px; height: 44px"
              background="#f7f8fa"
              placeholder="请输入搜索关键词"
              @search="serachData"
              @cancel="serachData"
            />
          </div>
          <div class="SinceBuilding-middle1" v-show="ListData.length > 0" ref="SinceBuildingMiddle1">
            <ul v-for="(item, index) in ListData" :key="index" @click="handleAdd(item)" class="SinceBuilding-middle">
              <li class="SinceBuilding-middle2">户主姓名：{{ item.cqrxm }}</li>
              <li class="SinceBuilding-middle3">
                发送时间：{{ item.TASK_RECIEVEDATE }}
                <span>初判结论：{{ item.check_first_result == '1' ? '房屋基本安全' : '存在风险' }}</span>
              </li>
              <li class="SinceBuilding-middle4">
                具体用途：{{ item.fwyt == 1 ? '经营性自建房' : '其他自建房' }}
                <span style="width: 190px; overflow: hidden; text-overflow: ellipsis; text-align: right"
                  >房屋类型:{{ item.fwlx == 1 ? '自建房' : '非自建房' }}</span
                >
              </li>
            </ul>
          </div>
          <div v-show="ListData.length == 0" style="height: 95vh; text-align: center; padding-top: 20vh">
            <div style="margin-bottom: 10px">
              <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
            </div>
            <div>暂无数据</div>
          </div>
          <!-- <div class="SinceBuilding-footer" v-show="ISShow">
          <van-button color="dodgerblue" block @click="handleAdd">新增</van-button>
        </div> -->
        </div>
      </van-tab>
      <van-tab title="已检查">
        <div class="SinceBuilding-nfcc">
          <div style="margin-top: 10px">
            <van-search
              v-model="value"
              style="border-radius: 10px; height: 44px"
              background="#f7f8fa"
              placeholder="请输入搜索关键词"
              @search="serachData"
            />
          </div>
          <div class="SinceBuilding-middle1" v-show="ListData.length > 0" ref="SinceBuildingMiddle1">
            <ul v-for="(item, index) in ListData" :key="index" @click="handleAdd(item)" class="SinceBuilding-middle">
              <li class="SinceBuilding-middle2">户主姓名：{{ item.cqrxm }}</li>
              <li class="SinceBuilding-middle3">
                发送时间：{{ item.TASK_RECIEVEDATE }}
                <span>初判结论：{{ item.check_first_result == '1' ? '房屋基本安全' : '存在风险' }}</span>
              </li>
              <li class="SinceBuilding-middle4">
                具体用途：{{ item.fwyt == 1 ? '经营性自建房' : '其他自建房' }}
                <span style="width: 190px; overflow: hidden; text-overflow: ellipsis; text-align: right"
                  >房屋类型:{{ item.fwlx == 1 ? '自建房' : '非自建房' }}</span
                >
              </li>
            </ul>
          </div>
          <div v-show="ListData.length == 0" style="height: 95vh; text-align: center; padding-top: 20vh">
            <div style="margin-bottom: 10px">
              <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
            </div>
            <div>暂无数据</div>
          </div>
          <!-- <div class="SinceBuilding-footer" v-show="ISShow">
          <van-button color="dodgerblue" block @click="handleAdd">新增</van-button>
        </div> -->
        </div>
      </van-tab>
    </van-tabs>
  </div>
</template>
  <script>
import dd from 'gdt-jsapi'
import { houseCheckFwCheckCountry } from '@/utils/api'
export default {
  data() {
    return {
      active: '0',
      value: '',
      ISShow: true,
      cityCode: '',
      pageNo: 0,
      ListData: [],
      deepListData: [],
    }
  },
  methods: {
    handleAdd(data) {
      this.$router.push({
        path: '/SinceBuildings',
        query: {
          data: JSON.stringify(data),
        },
      })
    },
    async serachData(val, name = this.active) {
      const res = await houseCheckFwCheckCountry('', this.cityCode ? this.cityCode : '441300000000', val, name)
      if (res.data.data.pageList != "null"&&res.data.data.pageList != null) {
        this.ListData = res.data.data.pageList
        this.deepListData = this.ListData
      } else{
        this.ListData =[]
        this.deepListData = []
      }
    },
    getData: async function (name) {
      const res = await houseCheckFwCheckCountry(
        '',
        this.cityCode ? this.cityCode : '441300000000',
        '',
        name ? name : '0'
      )
      this.ListData = res.data.data.pageList
      this.deepListData = this.ListData
    },
    handle(name, title) {
      this.getData(name)
    },
  },
  created() {},
  mounted() {
    this.cityCode = this.$route.query.data
    this.getData()
    dd.ready(function () {
      dd.setTitle({
        title: '新增巡查',
      })
        .then((res) => {})
        .catch((err) => {
          console.error(err)
        })
    })
  },
}
</script>
  <style lang="scss" scoped >
#SinceBuilding {
  height: 100vh;
  overflow: auto;
  background: #eee;
  width: 100vw;
  font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif;
  font-size: 18px;
  padding: 6px 10px;
  .title {
    width: 100%;
    height: 46px;
    background: #007aff;
    line-height: 50px;
    text-align: center;
    color: #ffffff;
    font-size: 20px;
  }
  .SinceBuilding-footer {
    width: 99%;
    margin-top: 4px;
    margin: 0 auto;
    padding-top: 12px;
  }
  .SinceBuilding-middle1 {
    height: 87vh;
    overflow: auto;
    .SinceBuilding-middle {
      background-color: #fff;
      border-radius: 10px;
      padding: 8px 10px;
      width: 98%;
      height: 1.7rem;
      margin: 0 auto;
      margin-top: 14px;
      .SinceBuilding-middle2 {
        font-size: 18px;
        font-weight: 1000;
        color: black;
        line-height: 36px;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .SinceBuilding-middle3 {
        font-size: 14px;
        color: #aaa;
        line-height: 24px;
        span {
          float: right;
          // padding-left: 4vw;
        }
      }
      .SinceBuilding-middle4 {
        font-size: 14px;
        color: #aaa;
        line-height: 24px;
        span {
          float: right;
          // padding-left: 4vw;
        }
      }
    }
  }
}
</style>
  <style>
#SinceBuilding .van-tab {
  font-size: 18px;
}
</style>
